<!DOCTYPE html>
<html>
<head>
    <title></title>
    <% include ../include/css_header.html %>
    <style>
    </style>
</head>
<body class="actlist_bg">
    <div class="container">
        <% if(!fromUser){ %>
        <div class="top_bar">
            <a class="icon-arrow-left bar_left" onclick="javascript:window.history.go(-1)"></a>
            <a class="icon-cog bar_right" href="#" style=""></a>
        </div>
        <% } %>
        <div style="height: 30px;"></div>
        <div class="row">
            <div class="col-xs-12 font_shadow_133000" style="color: #ffffff;text-align: center">
                <h2 id="factionTitle"><strong><%=faction.name %></strong></h2>
            </div>
        </div>
        <div class="row" style="margin: 10px 0px 0px;">
            <div class="col-xs-12 bg_op_panel" style="min-height: 430px;">
                <div style="height: 15px;"></div>
                <div class="bg_white_panel">
                    <% if(fromUser){ %>
                    <div style="margin-bottom: 30px;">
                        <p>
                            <h3>嗨~英雄!</h3>
                            &nbsp;&nbsp;&nbsp;&nbsp;
                            <img class="img-rounded size_24" src="/img/<%=fromUser.id %>"/>
                            <a href="/user/<%=fromUser.id %>"><%=fromUser.name %></a>
                            邀请你加入他所在的圈子，好多人翘首以盼呢～
                        </p>
                    </div>
                    <button type="button" class="btn btn-success btn-block" id="joinFactionBtn">强势加入～</button>
                    <hr>
                    <% } %>
                    <div style="margin-top: 10px;">
                        <label>圈名称：</label>
                        <strong><%=faction.name %></strong>
                    </div>
                    <div style="margin-top: 10px;">
                        <label>创始人:</label>
                        <img src="/img/<%=faction.creator.id %>" class="img-rounded size_32" />
                        <a href="/user/<%=faction.creator.id %>"><%=faction.creator.name %></a>
                    </div>
                    <div style="margin-top: 10px;">
                        <label>圈标签:</label>
                        <% var tags = faction.tags,
                               len = tags.length;
                            if(len > 0){
                                for(var i=0; i<len; i++){
                                var tag = tags[i];
                        %>
                        <span class="label label-primary"><%=tag %></span>
                        <% } } %>
                    </div>
                    <div style="margin-top: 10px;">
                        <label>圈简介：</label>
                        <p class="well"><%=faction.description %></p>
                    </div>
                    <button type="button" class="btn btn-default btn-block toShare">
                        <strong><span class="icon-bubbles"></span> 发给好友/群/朋友圈</strong>
                    </button>
                </div>
            </div>
        </div>
        <img id="msg_logo" src="http://wechatjh.fourjoy.net/flogo/<%=faction.id %>.jpg" onError="this.src='http://wechatjh.fourjoy.net/message_img.jpg';" style="display: none;"/>
        <% include ../include/guide_tip.html %>
        <% include ../include/perfect_info_tip.html %>
        <% include ../include/copyright.html %>
    </div>
<% include ../include/js_footer.html %>
<script type="text/javascript">
    var userId = '<%=user.id %>';
    var factionId = '<%=faction.id %>';
    var from = '<%=fromUser?fromUser.id:"" %>';
    var shareData = {
        img_url: $('#msg_logo').attr('src'),
        link: siteGlobal.SITE_HOST+'/faction/info/'+factionId+'/'+userId,
        title: '快来加入我的圈子“<%=faction.name %>”，志同道合不醉不归!',
        desc: '本圈宗旨：<%=faction.description %> 保护隐私，谢绝推广，违规踢出哦～'
    }
    $(function() {
        WeixinUtil.initConfig(['onMenuShareTimeline', 'onMenuShareAppMessage'], true, function(){
            WeixinUtil.sharePage(shareData.title, shareData.desc, shareData.img_url, shareData.link)
        })
        //$('nav#menu_left').mmenu();
        $('#joinFactionBtn').on('click', function(e){
            //_showTip({data:'already'});
            $.post('/faction/join',
                    {factionId:factionId, from: from}, function(res){
                if(!res.error){
                    _showTip(res);
                }else{
                    AlertBox.showTip('加入失败!');
                }
            })
        });
        $('#publicInfoBtn').on('click', function(){
            $.post('/savePrivacy',
                    {faction: factionId, flag: true, colume:'newAndALl'},
                    function(res){
                        if(res.error){
                            AlertBox.showTip('操作失败');
                        }
                        window.location.href = '/faction/'+factionId;
                    })
        });
        $('#toEditUserBtn').on('click', function(){
            window.location.href = '/editUser/'+userId+'/tofaction_'+factionId;
        });
        $('#factionTitle').on('click', function(){
            window.location.href = '/faction/'+factionId;
        });
        <% if(!fromUser){ %>
        setTimeout(function(){
            $('.toShare').trigger('click')
        }, 1000)
        <% } %>
    });
    function _showTip(res){
        if(res.hasinfo){
            if(res.data === 'already')
                AlertBox.showTip('已打入内部,正在进入...');
            else
                AlertBox.showTip('一入此圈深似海...');
            setTimeout(function(){
                window.location.href = '/faction/'+factionId;
            }, 1000)
        }else{
            if(res.data === 'already')
                return _showModelTip('已打入圈子内部了！');
            else
                return _showModelTip('一入此圈深似海...');
        }
    }
    function _showModelTip(tip){
        $('#titleTip').html(tip);
        $('#perfectInfo').modal('show')
    }
</script>
</body>
</html>